<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Look What i Drew</title>
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
    <script src="tweetshirt.js"></script>
</head>
<body>

<canvas id="tshirtCanvas" width="600" height="200"></canvas>
<form>
    <p>
        <label for="backgroundColor">Select background color:</label>
        <select id="backgroundColor">
            <option value="white" selected="selected">White</option>
            <option value="black">Black</option>
        </select>
    </p>
    <p>
        <label for="shape">Circles or squares?</label>
        <select id="shape">
            <option value="none" selected="selected">Neither</option>
            <option value="circles">Circles</option>
            <option value="squares">Squares</option>
        </select>
    </p>
    <p>
        <label for="foregroundColor">Select text color:</label>
        <select id="foregroundColor">
            <option value="black" selected="selected">Black</option>
            <option value="white">White</option>
        </select>
    </p>
    <p>
        <label for="tweets">Pick a tweet:</label>
        <select id="tweets">
        </select>
    </p>
    <p>
        <input type="button" id="previewButton" value="Preview">
        <input type="button" id="autoButton" value="Auto">
    </p>
</form>

<script src="http://twitter.com/statuses/user_timeline/wickedsmartly.json?callback=updateTweets">

</script>

</body>
</html>